<template>
	<view class="wanl-shop" style="background-color: white">
		<!-- 背景 -->
		<view class="wrap">
<!--			<view class="bg-box" style="background-color: white"></view>-->
<!--			<view class="gc-1"></view>-->
<!--			<view class="gc-2"></view>-->
<!--			<view class="gc-3"></view>-->
		</view>
		<!-- 底部导航 -->
		<view class="cu-bar tabbar foot wanl-gray-dark">
			<view class="action" @tap="navChange('home')">
				<view v-if="pageCur == 'home'">
					<view class="user-pic shadow-warp"><image :src="$wanlshop.oss(shopData.avatar, 38, 38, 2, 'avatar')" mode="scaleToFill"></image></view>
				</view>
				<view v-else>
					<view class="wlIcon-31dianpu"></view>
					<view class="text-xs">首页</view>
				</view>
			</view>
			<view class="action" @tap="navChange('allgoods')">
				<view class="wlIcon-baobei" :class="pageCur == 'allgoods' ? 'text-orange' : ''"></view>
				<view :class="pageCur == 'allgoods' ? 'text-orange' : ''" class="text-xs">产品</view>
			</view>
			<!-- <view class="action" @tap="navChange('find')">
				<view class="wlIcon-baobei" :class="pageCur == 'find' ? 'text-orange' : ''"></view>
				<view :class="pageCur == 'find' ? 'text-orange' : ''">动态</view>
			</view> -->
<!--			<view class="action" @tap="navChange('category')">-->
<!--				<view class="wlIcon-fenlei1" :class="pageCur == 'category' ? 'text-orange' : ''"></view>-->
<!--				<view :class="pageCur == 'category' ? 'text-orange' : ''" class="text-xs">分类</view>-->
<!--			</view>-->

      <view class="btn-group action">
        <button class="cu-btn bg-gradual-yellow round-left" @tap="showModal('contact')">联系方式</button>
        <button class="cu-btn bg-gradual-orange round-right" @tap="showModal('distributors')">我要代理</button>
      </view>
<!--      <view class="action" @tap="showModal('contact')">-->
<!--        <view class="wlIcon-xiaoxizhongxin"></view>-->
<!--        <view class="text-xs">联系方式</view>-->
<!--      </view>-->
<!--      <view class="action" @tap="showModal('distributors')">-->
<!--        <view class="wlIcon-xiaoxizhongxin"></view>-->
<!--        <view class="text-xs">我要代理</view>-->
<!--      </view>-->
		</view>
		<!-- 浮动头部 -->
		<view
			class="sticky bg-orange"
			v-if="Opacity * 10 >= 3"
			:style="{
				paddingTop: wanlsys.top + 'px',
				backgroundColor: pageData.page.style.navigationBarBackgroundColor,
				color: pageData.page.style.navigationBarTextStyle,
				opacity: Opacity
			}"
		>
			<view class="shop-search wanl-gray-dark" @tap="search">
				<text class="wlIcon-sousuo1 margin-right-xs"></text>
				搜索店内产品
			</view>
			<view class="shop-menu text-white" style="font-size: 36rpx;" v-if="pageType">
				<view class="box">
					<view class="item" :class="{ select: filterIndex === 0 }" @tap="tabClick(0)">主页</view>
<!--					<view class="item" :class="{ select: filterIndex === 1 }" @tap="tabClick(1)">推荐</view>-->
<!--					<view class="item" :class="{ select: filterIndex === 2 }" @tap="tabClick(2)">销量</view>-->
<!--					<view class="item" :class="{ select: filterIndex === 3 }" @tap="tabClick(3)">新品</view>-->
          <view class="item" :class="{ select: filterIndex === 10 }" @tap="tabClick(10)">经销商留言</view>
          <view class="item"  @tap="shopInfo">企业信息</view>
<!--					<view class="item" :class="{ select: filterIndex === 4 }" @tap="tabClick(4)">-->
<!--						<text>价格</text>-->
<!--						<view class="icon">-->
<!--							<text :class="{ active: priceOrder === 1 && filterIndex === 4 }" class="wlIcon-sheng"></text>-->
<!--							<text :class="{ active: priceOrder === 2 && filterIndex === 4 }" class="wlIcon-jiang"></text>-->
<!--						</view>-->
<!--					</view>-->
				</view>
				<view class="text-lg" @tap="editStyle()" v-if="filterIndex != 0">
					<text class="wlIcon-listing-jf" v-if="listStyle == 'col-2-10'"></text>
					<text class="wlIcon-liebiao" v-else></text>
				</view>
			</view>
		</view>
		<!-- 主体 -->
		<view class="main" style="background-color: white" :style="{ top: wanlsys.top + 'px' }">
			<!-- 小程序 -->
			<view class="header">
				<!-- #ifdef MP -->
				<view class="border-custom margin-right-bj transparent"><text class="wlIcon-fanhui1" @tap="$wanlshop.back(1)"></text></view>
				<!-- #endif -->
        <image style="width: 80rpx;height: 80rpx;margin: 12rpx 12rpx 12rpx 0" :src="$wanlshop.oss(shopData.avatar, 38, 38, 2, 'avatar')" mode="scaleToFill"></image>

        <view class="text-black" style="flex: 1;">
					<view class="title" @tap="shopInfo">
						{{ shopData.shopname }}
						<text class="wlIcon-fangxiang2 margin-left-xs"></text>
					</view>
         	<view class="describe text-min" style="display: flex;align-items: center;">
            <view class="cu-tag radius sm margin-right-xs wanl-bg-orange tah-base">企业认证</view>
            <view style="display: flex" class="margin-right-xs">
              <view class="tah-base" :class="shopData.is_vip === 1 ? 'tah-vip-red-left' : 'tah-vip-gray-left'">{{ shopData.vip_name }}</view>
              <view class="tah-base" :class="shopData.is_vip === 1 ? 'tah-vip-red-right' : 'tah-vip-gray-right'">VIP会员</view>
            </view>
<!--						<text>粉丝数 {{ $wanlshop.toFormat(shopData.like, 'thousand') }}</text>-->
					</view>
				</view>
				<!-- #ifndef MP -->
				<view class="border-custom">
					<text class="wlIcon-guanzhu3 wanl-red" @tap="Tofollow" v-if="shopData.follow"></text>
					<text class="wlIcon-guanzhu3" @tap="Tofollow" v-else></text>
					<text class="wlIcon-31guanbi" @tap="$wanlshop.back(1)"></text>
				</view>
				<!-- #endif -->
			</view>
			<!-- 主体内容 -->
			<block v-if="pageType">
<!--				<view class="shop-search wanl-gray-dark margin-lr-bj" @tap="search">-->
<!--					<text class="wlIcon-sousuo1 margin-right-xs"></text>-->
<!--					{{ pageData.page.params.navigationBarTitleText }}-->
<!--				</view>-->
				<view class="shop-menu text-black margin-lr-bj margin-tb-sm" style="font-size: 36rpx;">
					<view class="box">
						<view class="item" :class="{ select: filterIndex == 0 }" @tap="tabClick(0)">主页</view>
<!--						<view class="item" :class="{ select: filterIndex == 1 }" @tap="tabClick(1)">推荐</view>-->
<!--						<view class="item" :class="{ select: filterIndex == 3 }" @tap="tabClick(3)">新品</view>-->
            <view class="item" :class="{ select: filterIndex == 10 }" @tap="tabClick(10)">经销商留言</view>
            <view class="item"  @tap="shopInfo">企业信息</view>
<!--						<view class="item" :class="{ select: filterIndex == 4 }" @tap="tabClick(4)">-->
<!--							<text>价格</text>-->
<!--							<view class="icon">-->
<!--								<text :class="{ active: priceOrder == 1 && filterIndex == 4 }" class="wlIcon-sheng"></text>-->
<!--								<text :class="{ active: priceOrder == 2 && filterIndex == 4 }" class="wlIcon-jiang"></text>-->
<!--							</view>-->
<!--						</view>-->
					</view>
					<view class="text-lg" @tap="editStyle()" v-if="filterIndex != 0">
						<text class="wlIcon-listing-jf" v-if="listStyle == 'col-2-10'"></text>
						<text class="wlIcon-liebiao" v-else></text>
					</view>
				</view>
				<!-- 自定义页面 -->
				<view class="wanl-page" v-if="filterIndex == 0">
					<view v-for="(item, index) in pageData.item" :key="item.type">
						<view v-if="item.type == 'banner'"><wanl-page-banner :pageData="item" /></view>
						<view v-if="item.type == 'image'"><wanl-page-image :pageData="item" /></view>
						<view v-if="item.type == 'video'"><wanl-page-video :pageData="item" /></view>
						<view v-if="item.type == 'menu'"><wanl-page-menu :pageData="item" /></view>
						<view v-if="item.type == 'notice'"><wanl-page-notice :pageData="item" /></view>
						<view v-if="item.type == 'article'"><wanl-page-article :pageData="item" /></view>
						<view v-if="item.type == 'headlines'"><wanl-page-headlines :pageData="item" /></view>
						<view v-if="item.type == 'search'"><wanl-page-search :pageData="item" /></view>
						<view v-if="item.type == 'activity'"><wanl-page-activity :pageData="item" /></view>
						<view v-if="item.type == 'categoryTitle'"><wanl-page-category-title :pageData="item" /></view>
						<view v-if="item.type == 'classify'"><wanl-page-classify :pageData="item" /></view>
						<view v-if="item.type == 'likes'"><wanl-page-likes :pageData="item" /></view>
						<view v-if="item.type == 'goods'"><wanl-page-goods :pageData="item" /></view>
						<view v-if="item.type == 'bargain'"><wanl-page-bargain :pageData="item" /></view>
						<view v-if="item.type == 'seckill'"><wanl-page-seckill :pageData="item" /></view>
						<view v-if="item.type == 'empty'"><wanl-page-empty :pageData="item" /></view>
						<view v-if="item.type == 'division'"><wanl-page-division :pageData="item" /></view>
					</view>
				</view>
        <block v-else-if="filterIndex === 10">
          <view v-for="(item, index) in distributorslistData" :key="index" class="box-item">
            <view class="title-lay">
              <view class="address">{{item.area}}</view>
              <view class="time">{{ $wanlshop.timeFormat(item.createtime,'yyyy-mm-dd hh:MM:ss') }}</view>
            </view>
            <view class="content">
              <view>代理人: {{ item.name }}</view>
              <!--            <view>联系方式: <text class="link" @click="lookPhone(item)">点击查看</text></view>-->
              <view>代理意向: {{ item.title }}</view>
              <view>详细内容: {{ item.leave_word }}</view>
            </view>
          </view>
        </block>
				<!-- 加载店铺商品 -->
				<view v-else class="bg-bgcolor">
					<wanl-product :dataList="goodsData" :dataStyle="listStyle"/>
				</view>
			</block>
<!--			<block v-else-if="pageCur == 'category'">-->
<!--				  -->
<!--				<view class="shop-search wanl-gray-dark margin-lr-bj" @tap="search">-->
<!--					<text class="wlIcon-sousuo1 margin-right-xs"></text>-->
<!--					{{ pageData.page.params.navigationBarTitleText }}-->
<!--				</view>-->
<!--				<view class="shop-category">-->
<!--					<view class="item margin-bj radius-bock" v-for="(item, index) in categoryData" :key="item.id">-->
<!--						<view class="nav margin-lr-bj" v-if="item.childlist.length == 0" @tap="productCategoryList(item.id, item.name)">-->
<!--							<text class="text-df">{{ item.name }}</text>-->
<!--							<text class="wlIcon-fanhui2"></text>-->
<!--						</view>-->
<!--						<view class="nav margin-lr-bj" v-else>-->
<!--							<text class="text-df">{{ item.name }}</text>-->
<!--						</view>-->
<!--						<view class="action margin-lr-bj" v-if="item.childlist.length != 0">-->
<!--							<block v-for="(vo, key) in item.childlist" :key="vo.id">-->
<!--								<view class="padding-bj" v-if="vo.childlist.length == 0" @tap="productCategoryList(vo.id, vo.name)">-->
<!--									<text>{{ vo.name }}</text>-->
<!--								</view>-->
<!--								<view v-else class="padding-bj" @tap="showDrawer(vo.childlist)">-->
<!--									{{ vo.name }}-->
<!--									<text class="wlIcon-fanhui2 margin-left"></text>-->
<!--								</view>-->
<!--							</block>-->
<!--						</view>-->
<!--					</view>-->
<!--				</view>-->
<!--			</block>-->
			<uni-drawer :visible="showRight" width="75%" mode="right" @close="closeDrawer">
				<view class="drawer">
					<view class="shop-category">
						<view class="item radius-bock" v-for="(item, index) in categoryChildlistData" :key="item.id">
							<view class="nav margin-lr-bj" v-if="item.childlist.length == 0" @tap="productCategoryList(item.id, item.name)">
								<text class="text-df">{{ item.name }}</text>
								<text class="wlIcon-fanhui2"></text>
							</view>
							<view class="nav margin-lr-bj" v-else>
								<text class="text-df">{{ item.name }}</text>
							</view>
							<view class="action margin-lr-bj">
								<block v-for="(vo, key) in item.childlist" :key="vo.id">
									<view class="padding-bj" v-if="vo.childlist.length == 0" @tap="productCategoryList(vo.id, vo.name)">
										<text>{{ vo.name }}</text>
									</view>
									<view v-else class="padding-bj" @tap="showDrawer(vo.childlist)">
										{{ vo.name }}
										<text class="wlIcon-fanhui2 margin-left"></text>
									</view>
								</block>
							</view>
						</view>
					</view>
				</view>
			</uni-drawer>
			<uni-load-more :status="status" :content-text="contentText" />

      <view class="WANL-MODAL text-sm" @touchmove.stop.prevent="moveHandle">
        <!-- 联系方式 -->
        <view class="cu-modal bottom-modal" :class="modalName == 'contact' ? 'show' : ''" @tap="hideModal">
          <view class="cu-dialog" @tap.stop="">
            <view class="wanl-modal">
              <view class="head padding-bj">
                <view class="content"><view class="text-lg">联系方式</view></view>
              </view>
              <scroll-view class="scroll-y" scroll-y="true">
                <view class="table solid-bottom">
                  <view class="name wanl-gray">联系人</view>
                  <view class="value">{{shopData.contacts}}</view>
                </view>
                <view class="table solid-bottom">
                  <view class="name wanl-gray">联系方式</view>
                  <view class="value wanl-tag">
                    {{shopData.contact_number}}
                    <view class="wlIcon-dianhua wanl-orange padding-left-bj" @tap="$wanlshop.phone(shopData.contact_number)"></view>
                  </view>
                </view>
                <view class="table solid-bottom">
                  <view class="name wanl-gray">微信二维码</view>
                  <view class="value wanl-tag">
                    <view class="wlIcon-gerenerweima wanl-orange" @tap="previewImage($wanlshop.oss(shopData.wechat_qrcode))"></view>
                  </view>
                </view>
                <view class="table solid-bottom">
                  <view class="name wanl-gray">地址</view>
                  <view class="value">{{ shopData.city }}</view>
                </view>
                <view class="table solid-bottom">
                  <view class="name wanl-gray">温馨提示</view>
                  <view class="value">联系时说在休食帮看到的，会有很多优惠哦</view>
                </view>
              </scroll-view>
              <view class="foot padding-lr-bj"><button class="cu-btn bg-gradual-orange round text-bold complete" @tap="hideModal">完成</button></view>
            </view>
          </view>
        </view>

        <!-- 我要代理 -->
        <view class="cu-modal bottom-modal" :class="modalName == 'distributors' ? 'show' : ''" @tap="hideModal">
          <view class="cu-dialog" @tap.stop="">
            <view class="wanl-modal">
              <view class="head padding-bj">
                <view class="content"><view class="text-lg">我要代理</view></view>
              </view>
              <scroll-view class="scroll-y" scroll-y="true">
                <view class="table solid-bottom">
                  <view class="name wanl-gray">姓名</view>
                  <view class="value">
                    <input  v-model="distributorsFrom.name" placeholder="请输入姓名" />
                  </view>
                </view>
                <view class="table solid-bottom">
                  <view class="name wanl-gray">手机号码</view>
                  <view class="value">
                    <input v-model="distributorsFrom.phone" placeholder="请输入手机号码" maxlength="11" type="number"/>
                  </view>
                </view>
                <view class="table solid-bottom">
                  <view class="name wanl-gray">微信号</view>
                  <view class="value">
                    <input v-model="distributorsFrom.wechat" placeholder="请输入微信号" />
                  </view>
                </view>
                <view class="table solid-bottom">
                  <view class="name wanl-gray">公司</view>
                  <view class="value">
                    <input v-model="distributorsFrom.company" placeholder="请输入公司" />
                  </view>
                </view>
                <view class="table solid-bottom" @click="openCityPicker">
                  <view class="name wanl-gray">代理区域</view>
                  <view class="value">{{ distributorsFrom.area }}</view>
                </view>
                <view class="table solid-bottom">
                  <view class="name wanl-gray">留言内容</view>
                  <view class="value">
                    <uni-easyinput type="textarea"  v-model="distributorsFrom.leave_word" placeholder="请输入内容"/>
                  </view>
                </view>
                <view class="table solid-bottom padding-tb-bj">
                  <uni-data-checkbox mode="tag" v-model="distributorsFrom.permission" :localdata="permissionRadio"/>
                </view>
                <view class="table solid-bottom wanl-tag padding-tb-bj" style="justify-content: left">
                  <checkbox value="cb" style="transform:scale(0.7)" :checked="distributorsFrom.agree" />
                  <text class="padding-lr-bj">我已阅读并同意</text>
                  <text class="wanl-orange" @tap="$wanlshop.on('/pages/article/details?id=5&title=用户使用协议')">《网络用户保密协议》</text>
                </view>

              </scroll-view>
              <view class="foot padding-lr-bj"><button class="cu-btn bg-gradual-orange round text-bold complete" @tap="addDistributors">完成</button></view>
            </view>
          </view>
        </view>
      </view>
      <!-- 提示窗示例 -->
      <uni-popup ref="alertDialog" type="dialog">
        <uni-popup-dialog
            type="info"
            cancelText="关闭"
            confirmText="开通"
            title="提示信息"
            content="VIP会员才能查看"
            @close="dialogClose"
            @confirm="dialogConfirm"/>
      </uni-popup>
      <lb-picker
          :list="cityData"
          :props="cityMap"
          :level="2"
          z-index="9999"
          mode="multiSelector"
          @confirm="cityConfirm"
          ref="cityPicker"/>
		</view>
	</view>
</template>

<script>
import LbPicker from '@/components/lb-picker'
export default {
  components: {LbPicker},
	data() {
		return {
			shop_id: 0,
			wanlsys: this.$wanlshop.wanlsys(),
			pageCur: 'home',
			pageType: true,
			pageData: {
				page: {
					params: {
						navigationBarTitleText: '搜索店内商品'
					},
					style: {
						navigationBarBackgroundColor: '#ff4f00',
						navigationBarTextStyle: '#333'
					}
				}
			},
			shopData: {
				shopname: '加载中..',
				follow: false,
				like: 0
			},
			categoryData: [],
			categoryChildlistData: [],
      distributorslistData: [],
      distributors_page: 1,
			showRight: false,
			Opacity: 0,
			WanlScroll: 0, //记录页面滚动
			scrollStype: false, //滚动状态
			background: '../../static/1200px-wanLan_logo_bg.png',
			// 列表
			filterIndex: 0, //当前页面
			goodsData: [],
			priceOrder: 0, //1 价格从低到高 2价格从高到低
			listStyle: 'col-2-10 bg-bgcolor',
			params: {
				search: '',
				sort: 'weigh',
				order: 'asc',
				page: 1,
				filter: {},
				op: {}
			},
			reload: false, //判断是否上拉
			last_page: 0,
			status: 'loading',
			contentText: {
				contentdown: '',
				contentrefresh: '正在加载..',
				contentnomore: '没有更多数据了'
			},
      modalName: null, // 弹出层
      distributorsFrom:{
        name: '',
        phone: '',
        wechat: '',
        company: '',
        area:'',
        leave_word:'对产品很敢兴趣，请电话联系',
        permission:0,
        agree:true
      },
      permissionRadio: [
        { text: '同意同类厂家查看', value: 0 },
        { text: '同意意向厂家查看', value: 1 }],
      cityData:{},
      cityMap:{
        label: 'name',
        children: 'city'
      },
		};
	},
	onLoad(option) {
		this.shop_id = option.id;
		this.params.filter = { shop_id: this.shop_id };
		this.params.op = { shop_id: '=' };
		this.getCityData();
		this.loadPageData();
		this.getDistributorsList();
		// 如果传来type
		if (option.type) {
			this.tabClick(option.type);
		}
	},
	onPageScroll(e) {
		let tmpY = 20 + this.wanlsys.top;
		e.scrollTop = e.scrollTop > tmpY ? tmpY : e.scrollTop; //如果当前高度大于250则250否则当前高度
		this.Opacity = e.scrollTop * (1 / tmpY); //$headerOpacity 赋值当前高度x（1÷250）
	},
	// 监听上拉
	onPullDownRefresh() {
    if (this.filterIndex === 10){
      this.distributors_page = 1
      this.getDistributorsList()
    }else {
      this.params.page  = 1;
      this.reload = true;
      this.loadData();
    }

	},
	// 下拉刷新
	onReachBottom() {
    if (this.filterIndex === 10){
      this.getDistributorsList()
    }else {
      if (this.params.page >= this.last_page) {
        this.status = 'noMore';
      } else {
        this.reload = false;
        this.contentText.contentdown = '上拉显示更多';
        this.params.page = this.params.page + 1; //页码+1
        this.status = 'loading';
        this.loadData();
      }
    }
	},
	// 监听返回
	onUnload() {
		if (this.showRight) {
			this.closeDrawer();
			return true;
		}
	},
  // onBackPress() {
  //   if (this.$refs.fab.isShow) {
  //     this.$refs.fab.close()
  //     return true
  //   }
  //   return false
  // },
	methods: {
    getCityData(){
      uni.request({
        url: 'https://www.xiushibang.com/uploads/city.json',
        success: (res) => {
          this.cityData = res.data
        }
      });
    },
    addDistributors(){
      if (!this.distributorsFrom.name){
        this.$wanlshop.msg('请输入您的姓名')
      }else if(!/^1[3-9]\d{9}$/.test(this.distributorsFrom.phone)){
        this.$wanlshop.msg('请输入正确的手机号');
      }else if (!this.distributorsFrom.wechat){
        this.$wanlshop.msg('请输入您的微信号')
      }else if (!this.distributorsFrom.company){
        this.$wanlshop.msg('请输入您的公司')
      }else if (!this.distributorsFrom.area){
        this.$wanlshop.msg('请选择您的地区')
      }else if (!this.distributorsFrom.leave_word){
        this.$wanlshop.msg('请输入您的留言')
      }else if (!this.distributorsFrom.agree){
        this.$wanlshop.msg('请勾选用户协议')
      }else{
        this.distributorsFrom.shop_id = this.shop_id
        this.$api.post({
          url: '/wanlshop/shop/agent',
          data: this.distributorsFrom,
          success: res => {
            this.$wanlshop.msg('提交成功')
            this.hideModal()
          }
        })
      }

    },
    lookPhone(item){
      const _that = this
      this.$api.get({
        url: '/wanlshop/invitation/look',
        data: {
          invitation_id: item.id
        },
        success: res => {
          uni.showActionSheet({
            itemList: [item.contact_number],
            success: function (res) {
              _that.$wanlshop.phone(item.contact_number)
            },
            fail: function (res) {
              console.log(res.errMsg);
            }
          });
        },
        fail: error => {
          _that.$refs.alertDialog.open()
        }
      });
    },
    dialogConfirm() {
      this.$refs.alertDialog.close()
      uni.navigateTo({url: '/pages/distributors/vip'})
    },
    dialogClose(){
      this.$refs.alertDialog.close()
    },
    //禁止父元素滑动
    moveHandle() {},
    // 弹出层
    showModal(name) {
      this.modalName = name;
    },
    // 关闭弹出层
    hideModal(name) {
      if (name) {
        this.showModal(name);
      } else {
        this.modalName = null;
      }
    },
    openCityPicker(){
      this.$refs.cityPicker.show() // 显示
    },
    cityConfirm(e){
      var value = e.value
      var valueName = []
      for(var i=0;i<value.length;i++){
        if (!(i !== 0 && e.item[i].name === "全部")){
          valueName.push(e.item[i].name)
        }
      }
      this.distributorsFrom.area = valueName.join('/')
    },
    previewImage(path){
      // 预览图片
      uni.previewImage({
        urls: [path],
        longPressActions: {
          itemList: ['发送给朋友', '保存图片', '收藏'],
          success: function(data) {
            console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
          },
          fail: function(err) {
            console.log(err.errMsg);
          }
        }
      });
    },
    getDistributorsList(){
      this.$api.get({
        url: '/wanlshop/shop/leaveWordReceive',
        data: {
          shop_id:this.shop_id,
          current_page: this.distributors_page, //当前页码
        },
        success: res => {
          uni.stopPullDownRefresh();
          if (this.distributors_page === 1){
            this.distributorslistData = res.data;
          }else {
            this.distributorslistData = this.distributorslistData.concat(res.data)
          }

          if (res.last_page === res.current_page) {
            this.status = 'noMore';
          } else {
            this.status ='more';
            this.distributors_page++
          }
        }
      })
    },
		async loadData() {
			this.$api.get({
				url: '/wanlshop/product/lists',
				data: this.params,
				success: res => {
					uni.stopPullDownRefresh();
					this.status = res.total == 0 ? 'noMore' : 'more';
					this.goodsData = this.reload ? res.data : this.goodsData.concat(res.data); //数据 追加
					if (res.data.length == 0) {
						this.loadlikeData();
					}
					this.params.page = res.current_page; //当前页码
					this.last_page = res.last_page; //总页码
				}
			});
		},
		async loadPageData() {
			this.$api.get({
				url: '/wanlshop/shop/page',
				data: {
					id: this.shop_id
				},
				success: res => {
					this.status = 'more';
					this.shopData = res.shop;
					this.categoryData = res.category;
					if (res.page) {
						this.pageData = res.page;
						this.background = res.page.page.style.pageBackgroundImage;
					} else {
						this.tabClick(1);
					}
				}
			});
		},
		// 关注
		async Tofollow() {
			this.shopData.follow = !this.shopData.follow;
			if (this.shopData.follow) {
				this.shopData.like += 1;
				this.$store.commit('statistics/dynamic', {
					concern: this.$store.state.statistics.dynamic.concern + 1
				});
				
			} else {
				this.shopData.like -= 1;
				this.$store.commit('statistics/dynamic', {
					concern: this.$store.state.statistics.dynamic.concern - 1
				});
			}
			this.$api.post({
				url: '/wanlshop/shop/follow',
				data: {
					id: this.shopData.id
				},
				success: res => {
					this.shopData.follow = res;
				}
			});
		},
		// 切换底部菜单
		navChange(name) {
			if (name == 'home') {
				this.tabClick(0);
			} else if (name == 'allgoods') {
				this.tabClick(1);
			}
			this.pageType = (name == 'category' || name == 'distributors') ? false : true;
			this.pageCur = name;
		},
		//筛选点击
		tabClick(index) {
			if (this.filterIndex === index && index !== 4) {
				return;
			}
			if (index === 4) {
				this.priceOrder = this.priceOrder === 1 ? 2 : 1;
			} else {
				this.priceOrder = 0;
			}
			this.filterIndex = index;
			// 排序方式
			if (index === 0) {
				this.loadPageData();
			} else {
				if (index === 1) {
					this.params.sort = 'weigh';
					this.params.order = 'asc';
				}
				if (index === 2) {
					this.params.sort = 'sales';
					this.params.order = 'asc';
				}
				if (index === 3) {
					this.params.sort = 'createtime';
					this.params.order = 'asc';
				}
				if (index === 4 && this.priceOrder === 1) {
					this.params.sort = 'price';
					this.params.order = 'asc';
				}
				if (index === 4 && this.priceOrder === 2) {
					this.params.sort = 'price';
					this.params.order = 'desc';
				}
				this.params.page = 1;
				this.reload = true;

        if (index === 10){
          this.loadPageData();
        }else {
          this.loadData();
        }
			}
			this.status = 'loading';
			uni.pageScrollTo({
				duration: 300,
				scrollTop: 0
			});
		},
		// 修改布局样式
		editStyle() {
			this.listStyle = this.listStyle == 'col-1-10' ? 'col-2-10' : 'col-1-10';
		},
		// 打开抽屉，并且加载品牌和类目属性
		showDrawer(data) {
			this.showRight = true;
			this.categoryChildlistData = data;
		},
		// 关闭抽屉
		closeDrawer() {
			this.showRight = false;
		},
		//跳转类目列表
		productCategoryList(cid, name) {
			this.$wanlshop.to('productList?shop_id=' + this.shop_id + '&category_id=' + cid + '&category_name=' + name);
		},
		search() {
			this.$wanlshop.to('productList?shop_id=' + this.shop_id, 'fade-in', 100);
		},
		shopInfo() {
			this.$wanlshop.to('info?shop_id=' + this.shop_id);
		}
	}
};
</script>

<style>
.box-item{
  background: white;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  margin: 22rpx;
  border-radius: 15rpx;
}
.box-item .title-lay{
  height: 80rpx;
  display: flex;
  justify-content: space-between;
  padding: 0 20rpx;
  align-items: center;
  border-bottom: 1rpx solid #eee;
}
.box-item .title-lay .address{
  color: black;
  font-size: 30rpx;
}
.box-item .title-lay .time{
  color: black;
  font-size: 30rpx;
}
.link{
  color: #ff9000;
  margin-left: 10rpx;
}
.box-item .content{
  color: #666;
  font-size: 30rpx;
  line-height: 2;
  padding: 20rpx;
}
.uni-fab__circle--rightBottom {
  bottom: 100px !important;
}
.uni-fab--rightBottom {
  bottom: 100px !important;
}
.uni-fab__item-image {
  width: 30px;
  height: 30px;
}
.cu-modal.bottom-modal .cu-dialog {
  padding-bottom: 100rpx;
}
.link{
  color: #ff9000;
  margin-left: 10rpx;
}
.tah-vip-red-left{
  border: 1rpx red solid;
  color: red;
  line-height: 32rpx;
  background-color: white
}
.tah-vip-red-right{
  background-color: red;
  color: white;
}

.tah-vip-gray-left{
  margin-right: 0;
  border: 1rpx gray solid;
  color: gray;
  background-color: white
}
.tah-vip-gray-right{
  background-color: gray;
  color: white;
}

.tah-base{
  padding: 0 7rpx !important;
  height: 36rpx  !important;
  font-size: 22rpx  !important;
  line-height: 36rpx  !important;
}
.cu-bar.tabbar .btn-group {
  flex: 3;
  justify-content: center;
}

</style>
